<template>
  <div>
    <el-card
      class="docketprintContainer"
      shadow="never"
      v-for="(item, index) in list"
      :key="index"
      style="page-break-after: always"
    >
      <div class="docketprintText">
        <div class="TestData" style="font-size: 14px">
          <table border="1" cellspacing="0" align="center">
            <caption style="margin-bottom: 10px">
              <h2 align="center">
                {{ item.mainName }}
              </h2>
            </caption>
            <tr align="center">
              <td width="232" height="40">准考证号</td>
              <td width="160" height="40" colspan="3">
                {{ item.userCertNo }}
              </td>
              <td rowspan="4"><img :src="item.userPic" alt="" /></td>
            </tr>
            <tr align="center">
              <td width="232" height="40">姓名</td>
              <td width="160" height="40" colspan="3">{{ item.userName }}</td>
            </tr>
            <tr align="center">
              <td width="232" height="40">身份证号码</td>
              <td width="160" height="40" colspan="3">{{ item.userIdCard }}</td>
            </tr>
            <tr align="center">
              <td width="232" height="40">考点</td>
              <td width="160" height="40" colspan="4">{{ item.locName }}</td>
            </tr>
            <tr align="center">
              <td width="232" height="40">考场号</td>
              <td width="160" height="40" colspan="2">{{ item.userRoomNo }}</td>
              <td width="160" height="40">座位号</td>
              <td width="160" height="40">{{ item.userRoomNumer }}</td>
            </tr>
          </table>
        </div>
        <div class="testTime" style="margin-top: 10px; font-size: 14px">
          <table border="1" cellspacing="0" align="center">
            <tr align="center">
              <th width="237" height="40">考试科目</th>
              <th width="237" height="40">考试日期</th>
              <th width="237" height="40">考试起止时间</th>
            </tr>
            <tr
              align="center"
              v-for="it in item.paperInformation"
              :key="it.paperId"
            >
              <td width="237" height="40">{{ it.subjectName }}</td>
              <td width="194" height="30">
                {{ it.subjectTime[0] }}
              </td>
              <td width="194" height="30">
                {{ it.subjectTime[1][0] }}-{{ it.subjectTime[1][0] }}
              </td>
            </tr>
          </table>
        </div>
        <div class="testRule" style="width: 700px; margin-top: 20px">
          <h2 class="testTitle" style="text-align: center">考场规则</h2>
          <div
            class="detailRule"
            style="padding: 20px 30px; width: 700px; height: 500px"
          >
            <div class="rule" v-html="item.examExplain">
            </div>
          </div>
        </div>
        <div class="footer">{{ index + 1 }}</div>
      </div>
      
    </el-card>
  </div>
</template>

<script>
export default {
  props: {
    list: {
      type: Array,
    },
  },
  data() {
    return {
      tableData: [
      ],
    };
  },
  created() {},
  mounted() {},
  methods: {},
};
</script>

<style scoped>
.docketprintContainer {
  position: relative;
  margin: 0 auto;
  width: 210mm;
  height: 297mm;
  margin-bottom: 10px;
}
.docketprintText {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  width: 190mm;
  height: 277mm;
}
.footer {
  font-size: 12px;
  box-sizing: border-box;
  margin-top: 140px;
  text-align: center;
}
.rule {
  white-space: pre-wrap;
  text-indent: -5px;
  font-size: 14px;
}
</style>
